<style lang="less">
@import "../../../assets/style/photo.less";
</style>

<template>
    <mxq-router-layout>
        <div class="photo">
            <Head slot="header" @headerClick="headerClick($event)">
                <div slot="headerTitle">
                    <span>{{towerName}}杆塔</span>
                </div>
                <div slot="headerRight">
                    <!-- <span>导航</span> -->
                </div>
            </Head>
            
            <span class="iconBox">
                <img
                    class="iconRight"
                    src="../../../assets/img/changguixunshi/icon_rw.png"
                    alt=""
                    @click="clickList"
                >
                <em class="iconText">{{iconText}}</em>
            </span>

            <!-- 拍照 start -->
            <!-- <take-photo
                :pohtoParam="pohtoParam"
                :photoLists="photoLists"
                :pohtoShow="pohtoShow"
                @quexian_data="initQuanxian"
                /> -->
            <!-- 拍照 end -->

            <van-row  @quexian_data="initQuanxian">
                <van-col class="col_item" span="24" v-for="(item,index) in photoLists" :key="index">
                    <p class="photo_item clearfix">
                    <label :for="item.title"  v-if="item.phoType!=''">
                            <span>
                                <em>*</em>
                            {{item.title}}
                            </span>
                        </label>
                        <label :for="item.title" v-else> {{item.title}}</label>
                        <span class="img_box clearfix">
                            <img :src="item.photoImg" alt="" style="width: 50px; float: left;" class="img_pho" @click="prompt">
                        </span>
                    </p>
                </van-col>
            </van-row>

            <van-row class="quexian_item">
                <van-col span="24">
                    <p class="photo_item tit_item clearfix">
                        <label for="架空线路缺陷核查"><em>*</em>架空线路缺陷核查</label>
                    </p>
                </van-col>
            </van-row>

            <!-- 八大线路缺陷 开始 -->
            <quexian-list
                :listLeftImg="listLeftImg" 
                :type_arr="type_arr"
                @quexianClick="quexianClick($event)"/>
            <!-- 八大线路缺陷 结束 -->

            <div class="btns">
                <van-tabbar>
                    <van-tabbar-item>
                        <van-button size="small" class="btn_l" @click="goYhList">隐患情况</van-button>
                    </van-tabbar-item>
                    <van-tabbar-item>
                        <van-button size="small" class="btn_r" @click="goClArea">测量记录</van-button>
                    </van-tabbar-item>
                </van-tabbar>
            </div>
        </div>
    </mxq-router-layout>
</template>

<script>
import Head from '../../../components/head'
// import TakePhoto from '../../components/taskTake-photo'
import QuexianList from '../../../components/quexian'
import iconHis from '../../../assets/img/changguixunshi/icon_histroy.png'
import { callData,fileData } from '../../../axios/axios'
import disPho from '../../../assets/img/changguixunshi/icon_dispho.png'
import { 
    Row,
    Col,
    Icon,
    Tabbar,
	TabbarItem,
	Button,
    Dialog,
    Toast
} from 'vant'

export default {
    components: {
        Head,
        // TakePhoto,
        QuexianList,
        [Row.name]: Row,
        [Col.name]: Col,
        [Icon.name]: Icon,
        [Tabbar.name]: Tabbar,
        [TabbarItem.name]: TabbarItem,
        [Button.name]: Button,
        [Dialog.name]: Dialog,
        [Toast.name]: Toast
    },
    data() {
        return {
            towerName: this.$route.query.towerName,
            iconText: '接受任务',    //右侧按钮文案
            // 历史图标
            listLeftImg: [iconHis,iconHis,iconHis,iconHis,iconHis,iconHis,iconHis,iconHis,iconHis],
            /* pohtoParam: {},
            pohtoShow: {
            	type: 'cgxs',
            	img: false
            }, */
            photoLists: [           // 拍照目录
                {
                    title: "杆塔牌拍照",
                    photoImg: disPho,
                    phoType: ''
                },
                {
                    title: "杆基拍照",
                    photoImg: disPho,
                    phoType: ''
                },
                {
                    title: "全塔拍照",
                    photoImg: disPho,
                    phoType: ''
                },
                {
                    title: "塔头拍照",
                    photoImg: disPho,
                    phoType: ''
                },
                {
                    title: "大号侧同拍照",
                    photoImg: disPho,
                    phoType: ''
                },
                {
                    title: "小号侧同拍照",
                    photoImg: disPho,
                    phoType: ''
                }
            ],
            type_arr: {},
            params: this.$route.query	//获取地址栏参数
        }
    },
    methods: {
        // 头部两侧按钮点击事件
        headerClick(e){
            
        },
        // 初始化缺陷数据
        initQuanxian(e){
            this.type_arr = e;
        },
    	// 八大缺陷的点击事件
		quexianClick(e){
            console.log(e);
            this.$router.push({
                name:'cgxs_quexianList',
                query: {
                    name: e.allName,
                    flag: e.FLAG,
                    taskStatus: this.params.status, //任务状态用于已完成时隐藏可操作接口
                    towerId: this.params.towerId,
                    towerTaskId: this.params.xsTowerTaskId,
                    taskId: this.params.taskId,
                    defectType: e.index,
                    xsTowerTaskId: this.params.xsTowerTaskId,
                    lineTowerId: this.params.lineTowerId,
                    lineId: this.params.lineId,
                    jdUserId: this.params.jdUserId,
                    phoType: this.params.phoType,
                    status: this.params.status,
                    taskStatus: this.params.taskStatus, 
                    towerStatus: this.params.towerStatus,
                    needMeasure: this.params.needMeasure,
                    index: this.params.index,    //taskType任务类型
                    lineName: this.params.lineName,
					towerName: this.params.towerName
                }
            })
		},
		alertMeg(){
			Dialog.alert({
				message: '只有接任务后，才可以继续接下来的操作'
			}).then(() => {
				// on close
			});
		},
        goYhList() {
            this.$router.push({
				name:'cgxs_yinhuanList',
				query : {
					xsId: this.params.xsId,
					page: this.params.page,
					size: this.params.size,
					towerId: this.params.towerId,
					punchtype: this.params.punchtype,
					lineId: this.params.lineId,
					lineName: this.params.lineName,
					towerName: this.params.towerName,
					taskId: this.params.taskId,
					taskStatus: this.params.taskStatus, 
					towerStatus: this.params.towerStatus,
					lineTowerId: this.params.lineTowerId,
					towerTaskId: this.params.towerTaskId
	        	}
			})
        },
        goClArea() {
            this.alertMeg()
            // this.$router.push('/cgxs_ceLiang');
        },
        // 接受任务
        clickList() {
            var params ={}
				params.xsTowerTaskId = this.$route.query.xsTowerTaskId,
                params.acceptTask = 1; //1 接单
                callData('/xsTaskServer/ZcXsTowerTask/appXsTowerJd', 'put', params).then(res => {
                if(res.success){
                    Toast(res.data)
                    const query = this.$route.query;
                    query.router = 'cgxs_allowPhotos';
                    query.towerStatus = 1;
                    console.log('cgxs',query);
                    this.$router.push({
                        name:'cgxs_allowPhotos',
                        query
                    })
                }else {
                    Toast(res.data)
                }
            })
        },
        prompt() {
            this.alertMeg()
        },
        // 杆塔必拍照
        photoVerification(e){
            let needPhoto = this.$route.query.phoType;    //string 1,2,3
            if(needPhoto){
                let needPhotoArr = needPhoto.split(',');//array
                let photoListsArr =  this.photoLists; //array 拍照项
                needPhotoArr.forEach((item,index) => {
                    photoListsArr.forEach((v,i) => {
                        if(item==i+1) {
                            this.photoLists[i].phoType=item;
                        }
                    })
                });
            }
        }
    },
    created(){
        this.photoVerification();
    }
}
</script>
